import '@/assets/css/control.css'
export default class CustomControl {
    onAdd(map) {
      this._map = map;
      // 创建控件的DOM元素
      this._container = document.createElement('div');
      this._container.className = 'custom-control';
      this._container.innerHTML = `
        <div id="legend" class="msc-sdk-legend" style="background: linear-gradient(to right, rgb(97, 88, 130), rgb(97, 88, 130), rgb(97, 88, 130), rgb(97, 88, 130), rgb(73, 102, 142), rgb(52, 117, 143), rgb(42, 123, 140), rgb(31, 129, 137), rgb(11, 141, 130), rgb(92, 154, 100), rgb(251, 158, 191), rgb(249, 162, 193), rgb(249, 162, 193));"><span style="width:16.666666666666668%">mm</span><span style="width: 16.666666666666668%">5</span><span style="width: 16.666666666666668%">10</span><span style="width: 16.666666666666668%">20</span><span style="width: 16.666666666666668%">40</span><span style="width: 16.666666666666668%">1m</span></div>
      `
      // 添加控件的交互逻辑和事件处理
  
      // 返回控件的DOM元素
      return this._container;
    }
  
    onRemove() {
      // 在控件从地图中移除时进行清理操作
      this._container.parentNode.removeChild(this._container);
      this._map = undefined;
    }
  }